{extend name="public/world"}
{block name="title"}修改项目{/block}
{block name="style"}
<style>
.layui-layout-body {overflow: auto;}
.layui-upload-list {min-height: 100px;}
.layui-upload-img {width: 150px;height: 100px;}
.layui-upload-list-son{position: relative;width: 150px;padding: 0 10px;display: inline-block;}
.layui-layer-setwin {right: 25px;}
</style>
{/block}
{block name="container"}
<div class="layui-form" lay-filter="layuiadmin-form-useradmin" id="layuiadmin-form-useradmin">
    <div class="layui-card" style="padding: 20px 0 0 0;min-height: 450px;">
        <div class="layui-form-item">
            <label class="layui-form-label label-required">项目分类</label>
            <div class="layui-input-inline" style="width:auto">
                <select name="type" lay-filter="type" lay-verify="required">
                    <option value="">请选择项目分类</option>
                    {volist name="types" id="type"}
                    <option value="{$key}"{if $pro.type==$key} selected{/if}>{$type}</option>
                    {/volist}
                </select>
            </div>
            <div class="layui-input-inline" style="width:300px;">
                <input type="radio" name="sys" value="0" title="内部项目"{if $pro.sys==0} checked{/if}>
                <input type="radio" name="sys" value="1" title="外部项目"{if $pro.sys==1} checked{/if}>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label label-required">项目名称</label>
            <div class="layui-input-inline" style="width:480px;">
                <input type="text" name="name" value="{$pro.name}" lay-verify="required" placeholder="请输入项目名称" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label label-required">项目描述</label>
            <div class="layui-input-inline" style="width:480px;">
                <textarea name="description" placeholder="请输入内容" class="layui-textarea">{$pro.description}</textarea>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">项目附件</label>
            <div class="layui-input-block">
                <button type="button" class="layui-btn" id="signBtn">多图片上传</button>
                <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;width: 450px;border-left-width: 1px;">
                    <div class="layui-upload-list" id="signImg">
                        {volist name="pro.images_list" id="img"}
                        <div class="layui-upload-list-son">
                            <img src="{$img}" class="layui-upload-img" layadmin-event="avartatPreview">
                            <span class="layui-layer-setwin"><a class="layui-layer-ico layui-layer-close layui-layer-close2 signImg" href="javascript:;"></a></span>
                        </div>
                        {/volist}
                    </div>
                </blockquote>
                <input type="hidden" name="images" value="{$pro.images}" class="upload-input">
            </div>
        </div>
        <div class="layui-form-item layui-hide">
            <input type="button" lay-submit lay-filter="LAY-front-submit" id="LAY-front-submit" value="确认">
        </div>
    </div>
</div>
{/block}
{block name="script"}
<script>
    //JavaScript代码区域
    layui.use(['form','upload'], function() {
        var $ = layui.$
            , layer = layui.layer
            , s = layui.upload
            , form = layui.form;
        //多图片上传
        s.render({
            elem: '#signBtn'
            , url: '/upload/upload.html'
            , method: 'post'
            , accept: 'images' /* 只能图片 */
            , exts: 'jpg|png|jpeg'
            , acceptMime: 'image/*'
            , multiple: true
            , size: 1024 * 4 /* 设置上传单一文件最大尺寸*/
            ,data: {
                path:'project'
            }
            , before: function(input){
                layer.msg('文件上传中...', {time:3000000});
            }
            , done: function(res, index, upload) {
                var obj = this.item;
                if (res.code == 0) {
                    layer.msg(res.msg);
                    return false;
                }

                layer.closeAll();
                $('#signImg').append('<div class="layui-upload-list-son"><img src="'+ res.data.file +'" class="layui-upload-img" layadmin-event="avartatPreview"><span class="layui-layer-setwin"><a class="layui-layer-ico layui-layer-close layui-layer-close2 signImg" href="javascript:;"></a></span></div>');
                var sign_image = '';
                $('#signImg').find('.layui-upload-img').each(function(i,e) {
                    var src = $(e).attr("src");
                    if(src) sign_image += sign_image ? '|'+src : src;
                });
                $(obj).siblings('.upload-input').val(sign_image);

                $('.signImg').click(function(){
                    $(this).parents('.layui-upload-list-son').remove();
                    var sign_image = '';
                    $('#signImg').find('.layui-upload-img').each(function(i,e) {
                        var src = $(e).attr("src");
                        if(src) sign_image += sign_image ? '|'+src : src;
                    });
                    $('#signBtn').siblings('.upload-input').val(sign_image);
                });
            }
        });
        $('.signImg').click(function(){
            $(this).parents('.layui-upload-list-son').remove();
            var sign_image = '';
            $('#signImg').find('.layui-upload-img').each(function(i,e) {
                var src = $(e).attr("src");
                if(src) sign_image += sign_image ? '|'+src : src;
            });
            $('#signBtn').siblings('.upload-input').val(sign_image);
        });
    });
</script>
{/block}